<template>
  <div class="count">
    <select v-model.number="n">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
    </select>
    <button @click="increment">+</button>
    <button @click="decrement">-</button>
    <button @click="jiaOdd(n)">为奇数+</button>
    <button @click="jiaServer">服务+</button>
    <p>8888</p>
    <button @click="incrementifodd">当前和为奇数+</button>

    <button @click="incrementwait">等一等+</button>
    <button @click="incrementFwu">服务器长度+</button>
  </div>
</template>
<script>
import { mapState, mapActions, mapMutations } from "vuex";
export default {
  name: "COUNT",
  data() {},
  computed: {
    ...mapState(["sum", "persons"]),
  },
  methods: {
    ...mapMutations(["JIA", "JIAN"]),
    ...mapActions(["jiaodd", "jiaServer"]),
    // increment() {
    //   this.$store.commit("JIA", this.n);
    // },
    // decrement() {
    //   this.$store.commit("JIAN", this.n);
    // },
    // incrementifodd() {
    //   this.$store.dispatch("jia", this.n);
    // },
    // incrementwait() {
    //   this.$store.dispatch("jia", this.n);
    // },
    // incrementFwu() {
    //   this.$store.dispatch("jia", this.n);
    // },
  },
};
</script>
<style>
.count {
  background-color: gray;
  padding: 30px;
}
botton {
  margin-right: 10px;
}
</style>